<template>
  <div class="list">
    <div class="scroll">
      <ul>
        <li v-for="(obj,ind) in ideas" :key="ind">
          <img :src="obj.img" alt>
          <p>{{obj.text}}</p>
        </li>
      </ul>
    </div>
  </div>
</template>
<script>
import { mapState, mapActions } from "vuex";

export default {
  computed: {
    ...mapState(["ideas"])
  },
  methods: {
    addClass(evt, ind) {
      this.current = ind;
      this.$parent.id = ind;
    }
  },
  mounted() {
    let myScroll;
    setTimeout(() => {
      myScroll = new IScroll(".list", {
        mouseWheel: true
      });
    }, 1000);
  }
};
</script>
<style scoped>
.list{
  position: absolute;
  top: 1.8rem;
  bottom: 0;
  overflow: hidden;
}
.list ul {
  width: 100%;
  background: #fff;
  overflow: hidden;
}
.list ul li {
  height: 1.4rem;
  width: 100%;
  padding: 0 0.24rem;
  margin-top: 0.2rem;
  display: flex;
}
.list ul li img {
  flex-shrink: 0; /*解决了图片大小不一的问题*/
  width: 1.4rem;
  height: 1.4rem;
}
</style>